﻿@using MyData.Dto
@model UserInfoDto
@{
    ViewBag.Title = "用户列表";
    Layout = "~/Views/Shared/_Index.cshtml";
}
<script src="~/Content/webcam/webcam.min.js"></script>
<script src="~/Content/plupload/jquery-1.10.2.min.js"></script>
<script src="~/Content/plupload/plupload.full.min.js"></script>
<script src="~/Content/UI/js/select-ui.min.js"></script>
<script type="text/javascript">

    function queryParams() {
        return {
            WorkNum: $("#WorkNum").val(),
            NickName: $("#NickName").val(),
            Sex: $("input[name='Sex']:checked").val(),
            CardNum: $("#CardNum").val(),
            PhoneNum: $("#PhoneNum").val(),
            Address: $("#Address").val(),
            HeadUrl: $("#headImage").attr("src"),
            DepartId: $("#DepartId").val(),
            RoleName: $("#RoleName").val(),
            Nation: $("#Nation").val(),
            Age: $("#Age").val(),
            Id: $("#Id").val()
        };
    }
    $(function () {
        fnUploadImg("updatefile-btn", "loadXls", "headImage");
        $(".select3").uedSelect({
            width: 300
        });
    })
    function fnUploadImg(btnId, containerId, imgId) {
        var uploader = new plupload.Uploader({ //实例化一个plupload上传对象
            browse_button: btnId,
            url: '@Url.Action("UploadProduct", "UserInfo")',
            container: document.getElementById(containerId),
            flash_swf_url: '/Content/plupload/Moxie.swf',
            silverlight_xap_url: '/Content/plupload/Moxie.xap',
            filters: {
                mime_types: [ //只允许上传图片文件和rar压缩文件
                    { title: "Image files", extensions: "jpg,gif,png" }
                ],
                max_file_size: '20000kb', //最大只能上传20000kb的文件
                prevent_duplicates: false //不允许队列中存在重复文件
            },
            resize: {
                crop: false,
                quality: 60,
                preserve_headers: false
            },
            multipart_params: {}//参数
        });
        uploader.init(); //初始化
        uploader.bind('FilesAdded', function (uploader, files) {
            uploader.start();
        });
        uploader.bind('FileUploaded', function (uploader, file, responseObject) {
            var dom = document.getElementById(file.id)
            var response = $.parseJSON(responseObject.response);
            if (response.state == 1) {
                $("#" + imgId).attr("src", response.data);
            } else {
                layer.msg(response.message);
            }
        })
    }
</script>
<form id="form1">
    <div class="tools">
        <ul class="toolbar">
            <li class="click" onclick="fnSave()"><span><img src="../Content/UI/images/t02.png" /></span>保存</li>



            @*<li class="click" onclick="fnGrap()"><span><img src="../Content/UI/images/t01.png" /></span>拍照</li>*@
        </ul>
    </div>
    <div class="formbody">
        <ul class="seachform">
            <li style="width:420px">
                <label>打卡号码:</label><input value="@Model.WorkNum" type="text" class="dfinput" style="width:300px" id="WorkNum" name="WorkNum" required />
                @*<input name="" id="query" type="button" class="scbtn" value="查询" />*@
            </li>

            <li>
                <label>员工姓名:</label><input value="@Model.NickName" type="text" class="dfinput" id="NickName" name="NickName" required />
            </li>


        </ul>
        <ul class="seachform">

            <li style="width:427px">
                <label>员工性别:</label><cite style="height:32px"><input name="Sex" style="height:32px" type="radio" value="1" checked="checked" />男&nbsp;&nbsp;&nbsp;&nbsp;<input name="Sex" style="height:32px" type="radio" value="0" />女</cite>
            </li>
            <li>
                <label>员工年龄:</label><input value="@Model.Age" type="number" class="dfinput" id="Age" name="Age" required />
            </li>

        </ul>
        <ul class="seachform">
            <li style="width:427px">
                <label>所属部门:</label>
                <div class="vocation" style="width:300px">
                    <select class="select3" id="DepartId">
                        @{
                            var departs = ViewBag.Departs as List<DepartDto>;
                            foreach (var item in departs)
                            {
                                <option value="@item.Id">@item.Name</option>
                            }
                        }
                    </select>
                </div>
            </li>
            <li>
                <label>所属职位:</label><input value="@Model.RoleName" type="text" class="dfinput" id="RoleName" />
            </li>


        </ul>
        <ul class="seachform">
            <li>
                <label>&nbsp;&nbsp;&nbsp;手机号:</label><input value="@Model.PhoneNum" type="text" class="dfinput" id="PhoneNum" />
            </li>
            <li>
                <label>身份证号:</label><input value="@Model.CardNum" type="text" class="dfinput" id="CardNum" />
            </li>

        </ul>
        <ul class="seachform">
            <li>
                <label>民族:</label><input value="@Model.Nation" type="text" class="dfinput" id="Nation" />
            </li>
            <li>
                <label>现住地址:</label><input value="@Model.Address" type="text" class="dfinput" id="Address" />
            </li>
        </ul>
        <ul class="seachform" style="width:800px">
            @*<li style="width:400px">
                <label>视频区域:</label>
                <div id="my_camera" style="float:right"></div>
            </li>*@
            <li style="width:300px">
                <label>&nbsp;&nbsp;&nbsp;头像:</label>
                <div id="loadXls">
                    <img src="@Model.HeadUrl" height="200px" width="200px" id="headImage" />
                </div>
                <div style="text-align:center">
                    <a id="updatefile-btn" class="scbtn btn-primary">上传照片</a>
                </div>
            </li>
        </ul>

        <input type="hidden" id="Id" value="@Model.Id.ToString()" />
    </div>
</form>
<script type="text/javascript">
    //Webcam.set({
    //    width: 320,
    //    height: 240,
    //    image_format: 'jpeg',
    //    jpeg_quality: 90
    //});
    //Webcam.attach('#my_camera');
    if ('@Model.Id' != '00000000-0000-0000-0000-000000000000') {
        $("input[name='Sex'][value=" + '@Model.Sex' + "]").attr("checked", true);
        $("#DepartId").val('@Model.DepartId');
    }
    function fnSave() {
        $.post('@Url.Action("SaveUserInfo", "UserInfo")', queryParams(), function (result) {
            if (result.state == 1) {
                layer.msg('操作成功');
                var index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(index)
                parent.$("#table").bootstrapTable('refresh');
            }
            else {
                layer.msg(result.message);
            }
        })
    }
    function fnGrap() {
        Webcam.snap(function (data_uri) {

            $.post("@Url.Action("SaveHeadImg", "Visitor")", { base64: data_uri, type: 0 }, function (result) {
                if (result.state == 1) {
                    $("#headImage").attr("src", result.data);
                }
            })

        });

    }
    $(function () {
        $("#query").click(function () {
            $.post('@Url.Action("QueryUserInfo", "UserInfo")', { WorkNum: $("#WorkNum").val() }, function (result) {
                if (result.state == 1) {
                    $("#NickName").val(result.data);
                }
                else {
                    layer.msg(result.message);
                }

            });

        })

      
    })

</script>